$font-size-base: 18px;
$font-size-small: 0.875rem;
$font-size-mini: 0.75rem;
$font-size-tiny: 0.5rem;

$line-height-base: 1.7;

$primary: #782b90;
$code-bg: #3a2840;
$code-bg-inactive: #120d14;

$gray-100: #f8f9fa;
$gray-200: #e9ecef;
$gray-300: #dee2e6;
$gray-400: #ced4da;
$gray-500: #adb5bd;
$gray-600: #6f6970;
$gray-700: #4d4d4d;
$gray-800: #3c3c3b;

$spacer: 1rem;

$border-radius: 1rem * 0.8;
$border-radius-small: $border-radius * 0.875;
$border-radius-mini: $border-radius * 0.75;
$border-radius-tiny: $border-radius * 0.5;

$xs: 0;
$sm: 640px;
$md: 768px;
$lg: 1000px;
$xl: 1250px;

$container-sm: 620px;
$container-md: 738px;
$container-lg: 950px;
$container-xl: 1180px;

$button-box-shadow: 5px 5px 10px 0 rgba(0 0 0 / 20%);

$button-transition-time: 0.15s;
$button-transition-ease: ease-in-out;
$button-color-transition: color $button-transition-time $button-transition-ease;
$button-background-transition: background-color $button-transition-time $button-transition-ease;
$button-border-color-transition: border-color $button-transition-time $button-transition-ease;
